<template>
	<view class="mons">
		<view class="list">
			<navigator :url="'/pages/user/shjl?id='+l.oSaleReturnDetails[0].iDetailId" v-for="l in data" :class="{'over':l.cStatusName != '待退货审批'}" class="li">
				<view class="title">
					服务单号:{{l.cSaleReturnNo}}
					 <br>
					 <br>
					 申请时间：{{l.dCreatedTime}}
					<view class="right">
						<image v-if="l.cStatusName == '待退货审批'" src="../../static/img/3/3-78.png" mode="widthFix"></image>
						<image v-if="l.cStatusName != '待退货审批'" src="../../static/img/3/3-79.png" mode="widthFix"></image>
						<text>{{l.cStatusName}}</text>
					</view>
				</view>
				<view class="main">
					<view class="imgbox">
						<image :src="l.oSaleReturnDetails[0].oProductAlbum.imgUrl" mode="widthFix"></image>
					</view>
					<view class="texts">
						<view class="textsa">
							{{l.oSaleReturnDetails[0].cProductName}}
						</view>
						<view class="textsb">
							<text class="a">￥</text>{{l.oSaleReturnDetails[0].fReturnQuantity}}
							<!-- <text class="b">销量:12万件</text> -->
						</view>
						<view class="textsc">
							{{l.oSaleReturnDetails[0].cSpecDescription}}
							<!-- <text class="a">95%好评</text> -->
						</view>
					</view>
				</view>
			</navigator>
	</view>
	</view>
</template>

<script>
	export default {
		name: "",
		components: {

		},
		data() {
			return {
			data:[]
			}
		},
		onLoad() {
			let that = this;
			
			that.$Request.post(
			that.$api.httpApi.user.tuiList+'&token='+that.$SysCache.get('token')
			).then(res=>{
				if(res.code == 200){
					that.data=res.data.list;
				}
			});
		},
		methods:{
			
		},
		onNavigationBarButtonTap(){
				   uni.navigateTo({
				       // url: '/pages/user/vipjs'
				   })
		}
	}
</script>

<style scoped>
	.texts{
		display: inline-block;
		width: calc(100% - 206rpx - 85rpx);
		vertical-align: middle;
	}
	.textsa{
		font-size:26rpx;
		font-family:Microsoft YaHei;
		font-weight:400;
		color:rgba(4,0,0,1);
	}
	.textsb{
		font-size:24rpx;
		font-family:Adobe Heiti Std;
		font-weight:normal;
		color:rgba(240,64,111,1);
		margin-top: 18rpx;
	}
	.textsc{
		font-size:22rpx;
		font-family:Microsoft YaHei;
		font-weight:400;
		color:rgba(153,153,153,1);
		margin-top: 35rpx;
	}
	.textsc .a{
		font-size:19rpx;
		font-family:Microsoft YaHei;
		font-weight:400;
		color:rgba(136,136,136,1);
		margin-left: 10rpx;
		
	}
	.textsb .a{
		font-size: 18rpx;
	}
	.textsb .b{
		font-size:16rpx;
		font-family:Microsoft YaHei;
		font-weight:400;
		margin-left: 10rpx;
		color:rgba(136,136,136,1);
	}
	.imgbox{
		width: 206rpx;
		height: 206rpx;
		display: inline-block;
		vertical-align: middle;
		text-align: center;
		line-height: 206rpx;
		overflow: hidden;
	}
	.imgbox image{
		display: inline-block;
		vertical-align: middle;
		width: 70%;
	}
	.main{
		margin-top: 57rpx;
	}
	.li{
		background: #fff;
		margin-top: 20rpx;
		padding: 25rpx;
	}
	.li .title{
		font-size:18rpx;
		font-family:Microsoft YaHei;
		font-weight:400;
		color:rgba(102,102,102,1);
		line-height: 31rpx;
	}
	.li .title .right{
		font-size:25rpx;
		font-family:Microsoft YaHei;
		font-weight:400;
		color:rgba(240,64,111,1);
		float: right;
	}
		.li .title .right image{
			display: inline-block;
			width: 31rpx;
			vertical-align: middle;
		}
		.li .title .right text{
			display: inline-block;
			vertical-align: middle;
			margin-left: 14rpx;
		}
	.list{
		width: 95%;
		margin: auto;
		border-top: 1rpx solid #eee;
	}
	uni-page-body {
		height: 100%;
	}

	.mons {
		min-height: 100%;
		background: #EEEEEE;
		position: relative;
	}
	.over .title .right{
		color:#3CB980;
	}

</style>
